import Cookies from 'js-cookie' // 操作浏览器存储的cookie
// 知识点:浏览器本地存储*(缓存)方式 localStorage对象 seeionStroage对象 cookie
// 本地存储的都是字符串(JSON字符串/数字字符串)
// '0' '1'在三元表达式里都会被判定为true使用,只有''是false
// 数字0才是false 除了0的正数或负数都是true
// 总结 null undefined 0 '' NaN会被判定为false
const state = {
  // 左侧导航控制
  sidebar: {
    // '0'隐藏
    // '1'出现
    // +Cookies 强制转换字符串
    // !0=true !1=false(!取反,数字合计隐式转换的事情所以!把他转成真正的布尔类型)
    // 0代表的意思是隐藏(要给外面用false)所以现在为true不行 所以再取一次反
    // !!0 = false =隐藏   !!1= true 显示
    opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
    withoutAnimation: false
  },
  device: 'desktop'
}

const mutations = {
  TOGGLE_SIDEBAR: state => { // 修改左侧导航显示/隐藏
    state.sidebar.opened = !state.sidebar.opened
    state.sidebar.withoutAnimation = false
    if (state.sidebar.opened) {
      Cookies.set('sidebarStatus', 1)
    } else {
      Cookies.set('sidebarStatus', 0)
    }
  },
  CLOSE_SIDEBAR: (state, withoutAnimation) => { // 关闭左侧导航
    Cookies.set('sidebarStatus', 0) // cookie存0 代表侧边栏关闭
    state.sidebar.opened = false // 影响state里面变量
    state.sidebar.withoutAnimation = withoutAnimation // 有动画
  },
  TOGGLE_DEVICE: (state, device) => { // 设置当前设备环境标记字符串
    state.device = device
  }
}

const actions = { // 上面相关的对应的异步方法
  toggleSideBar({ commit }) {
    commit('TOGGLE_SIDEBAR')
  },
  // 关闭侧边栏导航 原写法：
  // closeSideBar(store,value){当前action已经在模块内了可以直接commit不用加模块名
  // store.commit('CLOSE_SIDEBAR',value.withoutAnimation)
  // }
  // {commit:对象} store= {commit}
  // 知识点：函数形参接收值就是一个被赋值的过程
  closeSideBar({ commit }, { withoutAnimation }) {
    commit('CLOSE_SIDEBAR', withoutAnimation)
  },
  toggleDevice({ commit }, device) {
    commit('TOGGLE_DEVICE', device)
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
